<template>
  <a-card>
    <a-form-model :model="formdata" v-bind="layout">
      <a-row>
        <!-- 搜索栏 -->
        <a-col :lg="6" :md="6" :sm="24">
          <a-form-model-item label="计量单位编码">
            <a-select
              @change="UnitNameChange"
              showSearch
              v-model="formdata.shortname"
            >
              <a-select-option
                v-for="item in UnitList"
                :key="item.id"
                :value="item.shortname + '|' + item.measname"
                >{{ item.shortname }} {{ item.measname }}</a-select-option
              >
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :lg="6" :md="6" :sm="24">
          <a-form-model-item label="计量单位名称">
            <a-input disabled v-model="formdata.measname"></a-input>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col
          :lg="6"
          :md="6"
          :sm="24"
          align="right"
          style="float: right; margin-bottom: 10px"
        >
          <a-button type="primary" @click="getsearch"> 查询 </a-button>
          <a-button :style="{ marginLeft: '8px' }" @click="handleReset">
            重置
          </a-button>
          <a-button
            :loading="asyncLoad"
            type="primary"
            :style="{ marginLeft: '8px' }"
            @click="SyncData"
          >
            与用友同步
          </a-button></a-col
        >
      </a-row>
    </a-form-model>

    <a-form-model :model="formdata" v-bind="layout">
      <a-row>
        <!-- 新增弹窗开始 -->
        <a-modal
          :visible="visibleXinZeng"
          width="50%"
          title="添加计量档案"
          okText="确定"
          @cancel="handleCancel2"
          @ok="handleOk2"
        >
          <a-form-model
            ref="ruleForm"
            :model="xinzeng_formdata"
            v-bind="layout"
          >
            <a-row>
              <a-col :md="12" :sm="24">
                <a-form-model-item label="计量单位编码">
                  <a-select>
                    <!-- <a-select-option
                      v-for="item in WarehouseCodeList"
                      :key="item.id"
                      :value="item.depotNo + '|' + item.depotName"
                      >{{ item.depotNo }} {{ item.depotName }}</a-select-option
                    > -->
                  </a-select>
                </a-form-model-item>
              </a-col>

              <a-col :md="12" :sm="24">
                <a-form-model-item label="计量单位名称">
                  <a-input v-model="xinzeng_formdata.measname"></a-input>
                </a-form-model-item>
              </a-col>

              <a-col :md="12" :sm="24">
                <a-form-model-item label="是否量纲基本单位">
                  <a-select>
                    <a-select-option value="1"> 是 </a-select-option>
                    <a-select-option value="2"> 否 </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>

              <a-col :md="12" :sm="24">
                <a-form-model-item label="所属量纲">
                  <a-select> </a-select>
                </a-form-model-item>
              </a-col>

              <a-col :md="12" :sm="24">
                <a-form-model-item label="换算率">
                  <a-input v-model="xinzeng_formdata.scalefactor" />
                </a-form-model-item>
              </a-col>
            </a-row>
          </a-form-model>
        </a-modal>
        <!-- 新增弹窗结束 -->
      </a-row>
    </a-form-model>

    <!-- 表格 -->
    <a-table
      bordered
      :data-source="dataSource"
      :columns="columns"
      :pagination="pagination"
      @change="handleTableChange"
      id="myTable"
      :rowKey="
        (record, index) => {
          return index;
        }
      "
    >
      <template slot="序号" slot-scope="text, record">
        <editable-cell
          :text="text"
          @change="onCellChange(record.key, 'xuhao', $event)"
        />
      </template>
    </a-table>

    <!-- 修改弹窗开始 -->
    <a-modal
      title="修改"
      :visible="visible1"
      width="50%"
      @ok="handleOk1"
      @cancel="handleCancel1"
      cancelText="取消"
      okText="保存"
    >
      <a-form-model ref="ruleForm" :model="xiugai_formdata" v-bind="layout">
        <a-row>
          <a-col :md="12" :sm="24">
            <a-form-model-item label="计量单位编码">
              <a-select
                v-model="xiugai_formdata.shortname"
                @change="DepotNameChange_Add2"
                showSearch
              >
                <!-- <a-select-option
                  v-for="item in WarehouseCodeList"
                  :key="item.id"
                  :value="item.depotNo + '|' + item.depotName + '|' + item.id"
                  >{{ item.depotNo }} {{ item.depotName }}</a-select-option
                > -->
              </a-select>
            </a-form-model-item>
          </a-col>

          <a-col :md="12" :sm="24">
            <a-form-model-item label="计量单位名称">
              <a-input v-model="xiugai_formdata.measname"></a-input>
            </a-form-model-item>
          </a-col>

          <!--      <a-col :md="12" :sm="24">
            <a-form-model-item label="计量档案主键">
              <a-input placeholder="" v-model="xiugai_formdata.zhujian">
              </a-input>
            </a-form-model-item>
          </a-col> -->
          <a-col :md="12" :sm="24">
            <a-form-model-item label="是否量纲基本单位">
              <a-select>
                <a-select-option value="1"> 是 </a-select-option>
                <a-select-option value="2"> 否 </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>

          <a-col :md="12" :sm="24">
            <a-form-model-item label="所属量纲">
              <a-select> </a-select>
            </a-form-model-item>
          </a-col>

          <a-col :md="12" :sm="24">
            <a-form-model-item label="换算率">
              <a-input v-model="xinzeng_formdata.scalefactor" />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-modal>
    <!-- 修改弹窗结束 -->
  </a-card>
</template>
 
<script>
import { JiLiangDangAnGuanLiHttp } from "../../services/modules/JiChuXinXiGuanLi/JiLiangDangAnGuanLi";
const $http = new JiLiangDangAnGuanLiHttp();
import { CommonAjax } from "../../services/modules/common";
const common = new CommonAjax();

export default {
  data() {
    return {
      //===============分页========================
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10, //每页中显示10条数据
        pageSizeOptions: ["10"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
      },
      queryParam: {
        //查询参数
        page: 1, //第几页
        size: 10, //每页中显示数据的条数
        hosName: "",
        hosCode: "",
        province: "",
        city: "",
      },

      //修改弹窗
      visible1: false,
      xiugai_formdata: {
        id: "", //修改时 要传这个id
        userId: "",
        shortname: "", //shortname计量单位编码
        measname: "", //measname 计量单位名称
        zhujian: "", //主键
        basecodeflag: "", //是否量纲基本单位
        oppdimen: "", //所属量纲
        scalefactor: "", //换算率
      },
      asyncLoad: false,
      //新增弹窗
      visibleXinZeng: false,
      xinzeng_formdata: {
        userId: "",
        shortname: "", //shortname
        measname: "", //measname计量单位名称
        zhujian: "", //主键
        basecodeflag: "", //是否量纲基本单位
        oppdimen: "", //所属量纲
        scalefactor: "", //换算率
        id: "",
      },

      formdata: {
        //增加数据
        id: "", //仓库编码id
        shortname: "", //编码
        measname: "", //名称
        zhujian: "", //主键
      },

      UnitList: [],

      // 增加栏的格式
      layout: {
        labelCol: { span: 8 },
        wrapperCol: { span: 15 },
      },

      // 表格数据
      dataSource: [],

      columns: [
        {
          key: 1,
          title: "序号",
          dataIndex: "xuhao",
          align: "center",
        },
        {
          key: 2,
          title: "计量单位编码",
          dataIndex: "shortname",
          align: "center",
        },
        {
          key: 3,
          title: "计量单位名称",
          dataIndex: "measname",
          align: "center",
        },
        /*       {
          title: "计量档案主键",
          dataIndex: "zhujian",
          align: "center",
        }, */
        {
          key: 4,
          title: "是否量纲基本单位",
          dataIndex: "basecodeflag",
          align: "center",
        },

        {
          key: 5,
          title: "所属量纲",
          dataIndex: "oppdimen",
          align: "center",
        },

        {
          key: 6,
          title: "换算率",
          dataIndex: "scalefactor",
          align: "center",
        },
      ],
    };
  },
  mounted() {
    this.GetMeasurementList(); //计量档案列表
    this.getAllMeasurementName(); //返回所有计量编码和名称
    // this.getUserByRoleName(); //根据角色名来查询用户名
  },

  methods: {
    //搜索开始
    getsearch() {
      let dd = (this.pagination.page = 1); //分页
      (this.dataSource = []), (this.pagination.current = 1);
      $http
        .GetMeasurementList(
          "?pageNo=" + dd + "&shortname=" + this.formdata.shortname
        )
        .then((res) => {
          const pagination = { ...this.pagination }; //分页
          this.data = res.result.records;
          pagination.total = res.result.total; //分页
          pagination.pageSize = res.result.size; //分页
          this.pagination = pagination; //分页
          console.log(this.data, "我是用户列表的信息");
          for (let i = 0; i < res.result.records.length; i++) {
            let data = {
              id: res.result.records[i].id,
              xuhao: (res.result.current - 1) * 10 + i + 1,
              shortname: res.result.records[i].shortname, //计量单位编码
              // zhujian: res.result.records[i].zhujian,
              measname: res.result.records[i].measname, //计量单位名称
              oppdimen: res.result.records[i].oppdimen, //所属量纲
              basecodeflag: res.result.records[i].basecodeflag, //是否量纲基本单位
              scalefactor: res.result.records[i].scalefactor, //换算率
            };
            console.log("要获取的数据", data);
            this.dataSource.push(data);
          }
        });
    },
    // 计量档案-列表
    GetMeasurementList() {
      let dd = this.queryParam.page; //分页
      console.log("dd", dd);
      (this.dataSource = []),
        $http.GetMeasurementList("?pageNo=" + dd).then((res) => {
          const pagination = { ...this.pagination }; //分页
          pagination.total = res.result.total; //分页
          pagination.pageSize = res.result.size; //分页
          this.pagination = pagination; //分页
          console.log("res----->", res);
          this.dataSource = res.result.records;
          let wowo = res.result.records;
          for (let i = 0; i < wowo.length; i++) {
            this.dataSource[i].basecodeflag =
              wowo[i].basecodeflag == 1 ? "是" : "否";
            this.dataSource[i].xuhao = (res.result.current - 1) * 10 + i + 1;
          }
        });
    },

    //  下拉框触发事件
    UserNameChange(value, option) {
      console.log(value, option);
      let array = value.split("|");
      console.log("array", array);
      this.xinzeng_formdata.userId = array[2];
      this.xinzeng_formdata.gonghao = array[0];
      this.xinzeng_formdata.xingming = array[1];
    },
    //  下拉框触发事件
    UserNameChange2(value, option) {
      console.log(value, option);
      let array = value.split("|");
      console.log("array", array);
      this.xiugai_formdata.userId = array[2];
      this.xiugai_formdata.workNo = array[0];
    },
    //根据角色 查询仓库管理员
    getUserByRoleName() {
      let dd = "仓库管理员";
      $http.getUserByRoleName("?roleName=" + dd).then((res) => {
        console.log("res", res);
        for (let i = 0; i < res.result.length; i++) {
          let data = {
            userId: res.result[i].userId,
            workNo: res.result[i].workNo,
          };
          this.UserList.push(data);
        }
      });
    },

    handleCancel1() {
      // 修改弹窗取消
      this.visible1 = false;
    },

    //重置当前页码及页码参数
    // resetPagination() {

    // },
    //重置
    handleReset() {
      this.formdata = {
        id: "",
        shortname: "",
        measname: "",
        basecodeflag: "",
        oppdimen: "",
        scalefactor: "",
        xuhao: "",
      };
      // this.resetPagination();
      this.pagination = {
        page: 1,
        total: 0,
        current: 1,
        pageSize: 10, //每页中显示10条数据
        // showSizeChanger: true,
        pageSizeOptions: ["10"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
      };

      this.CHONGZHILIEBIAO();
    },

    // 计量档案-列表
    CHONGZHILIEBIAO() {
      let dd = 1; //分页
      console.log("dd", dd);
      (this.dataSource = []),
        $http.GetMeasurementList("?pageNo=" + dd).then((res) => {
          const pagination = { ...this.pagination }; //分页
          pagination.total = res.result.total; //分页
          pagination.pageSize = res.result.size; //分页
          this.pagination = pagination; //分页
          console.log("res----->", res);
          this.dataSource = res.result.records;
          let wowo = res.result.records;
          for (let i = 0; i < wowo.length; i++) {
            this.dataSource[i].basecodeflag =
              wowo[i].basecodeflag == 1 ? "是" : "否";
            this.dataSource[i].xuhao = (res.result.current - 1) * 10 + i + 1;
          }
        });
    },
    //修改按钮
    showModal1(record) {
      console.log(record, "record");

      this.visible1 = !this.visible1;
    },
    handleOk1() {
      //修改弹窗ok
      this.visible1 = false;
      const data = {
        userId: this.xiugai_formdata.userId,
        inventoryOrganizationId: Number(
          this.xiugai_formdata.inventoryOrganizationFileId
        ),
        id: this.xiugai_formdata.id,
        organizationGodownKeeperId:
          this.xiugai_formdata.organizationGodownKeeperId,
        godownKeeperId: this.xiugai_formdata.id,
      };
      console.log("data::::::::::", data);
      $http.UpdateWarehouseManager(data).then((res) => {
        if (res.success) {
          this.$message.success("保存成功！");
          this.GetMeasurementList();
          this.xiugai_formdata = {};
          console.log(res);
        } else {
          this.$message.success("保存失败！");
        }
      });
    },
    handleOk2() {
      // 点击增加按钮
      this.visibleXinZeng = false;
      const data = {
        inventoryOrganizationId: this.xinzeng_formdata.id,
        userId: this.xinzeng_formdata.userId,
      };
      $http.SaveMeasurement(data).then((res) => {
        if (res.success) {
          this.$message.success("保存成功！");
          this.GetMeasurementList();
          this.xinzeng_formdata = {};
          console.log(res);
        } else {
          this.$message.success("保存失败！");
        }
      });
    },
    // // 确定删除吗？的触发函数
    // onDelete(_id) {
    //   const deletePath = `?id=${_id}`;
    //   $http
    //     .DeleteWarehouseManagerList(deletePath)
    //     .then((res) => {
    //       if (res && res.code === 200) {
    //         this.$message.success("删除成功");
    //         this.GetMeasurementList();
    //       } else {
    //         this.$message.error("删除失败");
    //       }
    //     })
    //     .then(() => {
    //       this.data = [];
    //     });
    // },

    //返回所有的仓库编码、仓库名称
    getAllMeasurementName() {
      $http.getAllMeasurementName().then((res) => {
        for (let i = 0; i < res.result.length; i++) {
          let data = {
            shortname: res.result[i].shortname,
            measname: res.result[i].measname,
            id: res.result[i].id,
          };
          this.UnitList.push(data);
          // console.log("返回所有的仓库编码、仓库名称", this.UnitList);
        }
      });
    },

    // 选择仓库编码的change触发函数
    UnitNameChange(value, option) {
      this.formdata.id = option.key;
      // console.log(value , option);
      const newValue = value.split("|");
      console.log(newValue);
      this.formdata.shortname = newValue[0];
      this.formdata.measname = newValue[1];
    },
    // 选择仓库编码的change触发函数---新增弹窗
    DepotNameChange_Add(value, option) {
      this.xinzeng_formdata.id = option.key;
      // console.log(value , option);
      let newValue = value.split("|");
      this.xinzeng_formdata.shortname = newValue[0];
      this.xinzeng_formdata.measname = newValue[1];
      console.log(this.xinzeng_formdata.id, "this.xinzeng_formdata.id");
    },
    // 选择仓库编码的change触发函数---Xiugai弹窗
    DepotNameChange_Add2(value, option) {
      console.log(value);
      this.xiugai_formdata.inventoryOrganizationFileId = option.key;
      let newValue = value.split("|");
      this.xiugai_formdata.shortname = newValue[0];
      this.xiugai_formdata.measname = newValue[1];
      this.xiugai_formdata.inventoryOrganizationFileId = newValue[2];
    },
    //新增弹窗
    showModalXinZeng() {
      this.visibleXinZeng = true;
    },
    handleCancel2() {
      //新增弹窗的取消
      this.visibleXinZeng = !this.visibleXinZeng;
    },

    // ==============分页======================
    handleTableChange(pagination) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.queryParam.page = pagination.current;
      this.queryParam.size = pagination.pageSize;
      this.GetMeasurementList();
    },
    //同步用友数据
    /* SyncData() {
      this.asyncLoad = true; //

      common.asynccMeasurementFiles().then((res) => {
        console.log("同步用友的数据", res);
        if (res.code == 200) {
          this.$message.success("同步成功");
        } else {
          this.$message.error("同步失败");
        }
        this.asyncLoad = false;
      });
      this.GetMeasurementList(); //计量档案列表
    }, */
    SyncData() {
      this.Loading = true;
      let data = "?transFileName=" + "SyncMeasurementFiles.ktr";
      common.asynccMeasurementFiles(data).then((res) => {
        console.log("res", res);
        if (res.success) {
          this.$message.success("同步成功！");
          this.GetMeasurementList();
          this.Loading = false;
        } else {
          this.$message.error("同步失败！" + res.message);
          this.Loading = false;
        }
      });
    },
  },
};
</script>